<template>
    <div class="teamplate-cashierPast">
        <div class="container-fluid">
            <div class="row h-query">
                <form class="form-inline">
                    <div class="form-group">
                        <label class="">开始日期：</label>
                        <input type="text" class="form-control start-date" id="j_startDate">
                    </div>
                    <div class="form-group">
                        <label class="">结束日期：</label>
                        <input type="text" class="form-control end-date" id="j_endDate">
                    </div>
                    <div class="form-group">
                        <button type="button" class="btn btn-default" @click="onInquiry">查询</button>
                    </div>
                    <div class="btn-group pull-right">
                        <button  type="botton"  class="btn btn-default"  @click="onExport"> 导出表格</button>
                    </div>
                </form>
            </div>
            <div class="row">
                <div class="list-table">
                    <div class="list-h item-hd" >
                        <div class="btn-group">
                            <button class="btn" @click="onTab(1)">收款员日收款汇总</button>
                            <button class="btn" @click="onTab(2)">收款员收款汇总</button>
                        </div>
                    </div>
                    <div class="item-bd">
                        <div class="table-wrap item" v-show='item==1'>
                            <div class="table-box">
                                <table class="table table-striped">
                                    <tbody >
                                        <tr>
                                            <th>收款员</th>
                                            <th class="tr">应收金额</th>
                                            <th class="tr">实收金额</th>
                                            <th class="tr">金额</th>
                                            <th class="tr">税额</th>
                                            <th class="tr">成本金额</th>
                                            <th class="tr">毛利</th>
                                        </tr>
                                        <tr v-for="(item,index) in lists.list1.data">
                                            <td>{{item.shky}}</td>
                                            <td class="tr">{{item.ysje|nums}}</td>
                                            <td class="tr">{{item.sshje|nums}}</td>
                                            <td class="tr">{{item.je|nums}}</td>
                                            <td class="tr">{{item.she|nums}}</td>
                                            <td class="tr">{{item.chbje|nums}}</td>
                                            <td class="tr">{{item.ml|nums}}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="b-balance clearfix has-border">
                                <div class="pull-left">实收金额
                                        <span class="pink">{{lists.list1.sum.sshje}}</span>
                                    </div>
                                <div class="pull-left">成本金额
                                    <span class="blue">{{lists.list1.sum.chbje}}</span>
                                </div>
                                <div class="pull-left">金额合计 {{lists.list1.sum.je}}</div>
                                <div class="pull-left">抹零合计 {{lists.list1.sum.ml}}</div>
                            </div>
                        </div>
                        <div class="table-wrap item" v-show='item==2'>
                            <div class="table-box">
                                <table class="table table-striped">
                                    <tbody >
                                        <tr>
                                            <th style="text-align:left">日期</th>
                                            <th style="text-align:left">收款员</th>
                                            <th style="text-align:right">应收金额</th>
                                            <th style="text-align:right">实收金额</th>
                                            <th style="text-align:right">金额</th>
                                            <th style="text-align:right">税额</th>
                                            <th style="text-align:right">成本金额</th>
                                            <th style="text-align:right">毛利</th>
                                        </tr>
                                        <tr v-for="(item,index) in lists.list2.data">
                                            <td style="text-align:left">{{item.rq}}</td>
                                            <td style="text-align:left">{{item.shky}}</td>
                                            <td style="text-align:right">{{item.ysje|nums}}</td>
                                            <td style="text-align:right">{{item.sshje|nums}}</td>
                                            <td style="text-align:right">{{item.je|nums}}</td>
                                            <td style="text-align:right">{{item.she|nums}}</td>
                                            <td style="text-align:right">{{item.chbje|nums}}</td>
                                            <td style="text-align:right">{{item.ml|nums}}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="b-balance clearfix has-border">
                                <div class="pull-left">实收金额
                                        <span class="pink">{{lists.list2.sum.sshje}}</span>
                                    </div>
                                <div class="pull-left">成本金额
                                    <span class="blue">{{lists.list2.sum.chbje}}</span>
                                </div>
                                <div class="pull-left">金额合计 {{lists.list2.sum.je}}</div>
                                <div class="pull-left">抹零合计 {{lists.list2.sum.ml}}</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    import bus from "../api/eventBus";
    import {
        setUi,
        setpopPerfect
    } from "../vuex/actions";
    import {
        ui,
        popPerfect
    } from "../vuex/getters";
    export default {
        components: {},
        data() {
            return {
                huowei: [],
                item: 1,
                lists: {
                    //页面表格数据
                    list1: {
                        data: [],
                        sum: {}
                    },
                    list2: {
                        data: [],
                        sum: {}
                    }
                },
                fdbs: '',
                title: '',
                urls: ''
            };
        },
        watch: {},
        vuex: {
            getters: {
                ui,
                popPerfect
            },
            actions: {
                setUi,
                setpopPerfect
            }
        },
        filters: {
            nums: info => {
                return info.toFixed(2);
            }
        },
        methods: {
            onTab(num) {
                //表格切换
                let me = this;
                me.item = num;
                me.onTableList();
            },
            onInquiry(e) {
                //查询列表
                let me = this;
                me.onTableList();
            },
            onTableList(e) {
                let me = this;
                if (me.item == 1) {
                    let res = {
                        startDate: $("#j_startDate").val(),
                        endDate: $("#j_endDate").val(),
                        fdbs: localStorage.getItem("fdbs")
                    };
                    me.title = '收款员日收款汇总';
                    me.urls = me.cfg.api + '/WRLSController/selectWRXSYMRXSQKHZDY';
                    me.service.selectWRXSYMRXSQKHZ(me, res, data => {
                        me.lists.list1.data = data.data.lists;
                        if (data.data.lists.length > 0) {
                            me.lists.list1.sum = data.data.sum;
                        } else {
                            for (let i in me.lists.list1.sum) {
                                me.$set(me.lists.list1.sum, i, 0);
                            }
                        }
                    });
                }
                if (me.item == 2) {
                    let res = {
                        startDate: $("#j_startDate").val(),
                        endDate: $("#j_endDate").val(),
                        fdbs: localStorage.getItem("fdbs"),
                        page: 1,
                        rows: 20
                    };
                    me.title = '收款员收款汇总';
                    me.urls = me.cfg.api + '/WRLSController/selectWRXSYXSQKHZDY';
                    me.service.selectWRXSYXSQKHZ(me, res, data => {
                        me.lists.list2.data = data.data.lists;
                        me.lists.list2.sum = data.data.sum;
                    });
                }
            },
            onExport(e) {
                let me = this;
                var downloadToken = +new Date();
                var _self = this;
                var url = me.urls + '?file=' + me.title + '&title=' + me.title + '&fdbs=' + me.fdbs + '&startDate=' + $('#j_startDate').val() + '&endDate=' + $('#j_endDate').val();
                var obj = {
                    time: downloadToken,
                    url: url,
                    _self: _self,
                }
                exportExcelForm(obj);
            },
        },
        mounted() {
            let me = this;
            let user = JSON.parse(sessionStorage.getItem("user"));
            if (!user) {
                router.push({
                    path: "/login"
                });
                return;
            }
            me.fdbs = localStorage.getItem('fdbs');
            $(".start-date,.end-date").datetimepicker({
                language: "zh-CN",
                weekStart: 1,
                todayBtn: 1,
                autoclose: 1,
                todayHighlight: 1,
                startView: 2,
                minView: 2,
                forceParse: 0,
                format: "yyyy-mm-dd"
            });
            let time = new Date();
            let startTimes = time.getFullYear() + "-" + (time.getMonth() + 1) + "-" + "01"; //默认开始日期
            let endTimes = time.getFullYear() + "-" + (time.getMonth() + 1) + "-" + me.util.string.numFix(time.getDate()); //默认结束日期
            $("#j_startDate").val(startTimes);
            $("#j_endDate").val(endTimes);

            me.onTableList();

            drugH();
            $(window).resize(function() {
                drugH();
            });
        }
    };
</script>